<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"               
                template="../../template/tagedu.xhtml">


    <ui:define name="title"><h:outputText value="Home"/></ui:define>
    <ui:define name="content">
        
        <link rel="Stylesheet" type="text/css" href="../../resources/css/main.css"></link>
        <link rel="Stylesheet" type="text/css" href="../../resources/css/plans_delete.css"></link>
        
        <body>

            <f:event type="preRenderComponent" listener="#{planBean.initPlan}"/>
            <h:form>
                <a id="filterPer" href="createPlans.xhtml">Criar Plano</a><br/>
                <span id="filterPer">Organização:</span>  
                <h:selectOneMenu id="organization" value="#{planBean.organizationID}">
                    <f:selectItems value="#{planBean.organizationList}"/>
                    <f:ajax execute="organization" render="unity " listener="#{planBean.showUnity}"/>
                </h:selectOneMenu>

                <h:panelGrid id="unity" columns="2">
                    <span id="filterPer">Unidade:</span> 
                    <h:selectOneMenu id="unityMenu" rendered="#{planBean.unitySelectVisible}" value="#{planBean.unityID}">
                        <f:selectItems value="#{planBean.unityList}"/>
                        <f:ajax execute="unityMenu" render="discipline" listener="#{planBean.showDiscipline}"/>
                    </h:selectOneMenu>
                </h:panelGrid>

                <h:panelGrid id="discipline" columns="2">
                    <span id="filterPer">Disciplina:</span> 
                    <h:selectOneMenu id="disciplineMenu" rendered="#{planBean.disciplineSelectVisible}" value="#{planBean.disciplineID}">
                        <f:selectItems value="#{planBean.disciplineList}"/>
                        <f:ajax execute="disciplineMenu" render="planList" listener="#{planBean.loadPlanList}"/>
                    </h:selectOneMenu>
                </h:panelGrid>
                <br/>            

                <h:panelGrid id="planList" columns="1">                     
                    <link rel="Stylesheet" type="text/css" href="../../resources/css/plans_delete.css"></link>
                    <div id="titleDiv">
                        <span id="titlePlan">Planos (#{planBean.planList.size()})</span>
                    </div><br/>

                    <ul id="listOfPlans">
                        <ui:repeat value="#{planBean.planList}" var="plan">
                            <li style="margin: 5px 10px 0 10px; width: 720px; background-color: lightgray;-webkit-border-radius: 10px;
                         -moz-border-radius: 10px;
                         border-radius: 10px;
                         border: 0px solid #ccc">
                                <span id="titleOfPlan">Plano do Bean</span>   
                                
                                <p:button id="remove" onclick="" value="Apagar"></p:button>
                                <h:outputLink id="editLink" value="editPlans.xhtml">
                                    <f:param name="plan" value="#{plan.id}"/>
                                    <h:outputText value="Editar"/>
                                </h:outputLink>
                                <br/>

                                <span class="boldInPlan">Disciplina:</span>
                                <span class="textInPlan">                                    
                                    <h:outputText value="#{plan.discipline.name}"/>
                                </span><br/>

                                <span class="boldInPlan">Tema:</span>
                                <span class="textInPlan">$$</span><br/>

                                <span class="boldInPlan">Data Inicial:</span>
                                <span class="textInPlan">#{plan.initialDate.time}</span><br/>

                                <span class="boldInPlan">Data Final:</span>
                                <span class="textInPlan">#{plan.finalDate.time}</span><br/>

                                <span class="boldInPlan">Descrição:</span>
                                <span class="textInPlan">#{plan.description}</span><br/>

                                <span class="boldInPlan">Objetivos:</span>
                                <span class="textInPlan">$$</span><br/><br/>             
                            </li>
                        </ui:repeat>
                    </ul>      
                </h:panelGrid>
            </h:form>
        </body>
    </ui:define>
</ui:composition>